<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link rel="stylesheet" type="text/css" href="../css/common.css?01_24" />
		<link rel="stylesheet" type="text/css" href="../css/templet.css?01_24" />
		<link rel="stylesheet" type="text/css" href="../fonts/font-awesome.min.css?01_24" />
		<link rel="stylesheet" type="text/css" href="../mui/css/mui.css?01_24" />

		<!--公共js-->
		<script type="text/javascript" src="../common/js/jquery.js?01_24"></script>

		<!--插件-->
		<script type="text/javascript" src="../common/js/vue.min.js?01_24"></script>
		<script type="text/javascript" src="../common/js/mui.min.js?01_24"></script>

		<script type="text/javascript" src="../common/js/fastclick.js"></script>
		<script type="text/javascript" src="../common/js/common.js?01_24"></script>
		<script type="text/javascript" src="../common/js/my_common.js?01_24"></script>
		<script type="text/javascript" src="../common/js/main.js?01_24"></script>
		<script type="text/javascript" src="../common/js/app.js?01_24"></script>
	</head>

	<body>
		<header class="bg-red9 fff f-20 pad-t-10 pad-b-10  pad-r-10">
			<div class="pa back pad-l-10" onclick="back()">
				<a></a>
			</div>
			<div class="center" data-l="1338"></div>
		</header>
		<div class="wrap_body work_record bg-grayF5" id="app" v-cloak>
			<div class="content pad-t-45">
				<nav class="cf center pad-l-12 pad-r-12 c999 bg-fff f-16">
					<div class="col-sm-5 pad-t-10 pad-b-10" :class="{active:page_data.sel_data==1}" @click="sel_cate_list(1)">{{b_lg[1339]}} <span class="f-14">({{Unprocessed}})</span></div>
					<div class="col-sm-5 pad-t-10 pad-b-10" :class="{active:page_data.sel_data==2}" @click="sel_cate_list(2)">{{b_lg[1340]}}</div>
				</nav>
				<div class="pad-t-50">

					<div class="have_content" v-if="memory_result.length>0">
						<div v-for="item in memory_result">
							<!--222-->
							<div @click="cli_look(item.is_read,item)">
								<div class="deal pad-l-12 pad-r-12 ">
									<div class="item pad-t-15 pad-b-15 pad-l-15 pad-r-15 bg-fff mag-t-10 btn_c">
										<dl class="cf">
											<dt class="fl f-15 f-b"><span class="red9 mag-r-5">{{item.table_name}}</span><span>{{b_lg[1341]}}</span></dt>
											<dd class="fr"><span class="clock pr"></span><span>{{item.time}}</span></dd>
										</dl>
										<dl class="cf mag-t-5">
											<dt class="fl f-16">
												<!--<span class="mag-r-5 f-15">菜品下单</span><span class="blue">2</span>-->
												<span class="mag-r-5" v-if="item.type == 1">{{b_lg[1342]}}</span>
												<span class="mag-r-5" v-else-if="item.type == 2">{{b_lg[1343]}}</span>
												<span class="mag-r-5" v-else-if="item.type == 3">{{b_lg[1344]}}</span>
											</dt>
											<dd class="fr">
												<!--<a class="red9" v-if="item.type == 1" @click="checkOrder(item.shop_table_id,item.pax)">{{b_lg[1233]}}</a>
												<a class="deal_btn red9 pad-l-15 pad-r-15" v-else="" @click="dealWith(item.type,item.shop_table_id,item.is_read)">{{b_lg[1345]}}</a>-->

												<a class="deal_btn red9 pad-l-15 pad-r-15" v-if="item.is_read == 1">{{b_lg[1345]}}</a>
												<a v-else class="red9">{{b_lg[1233]}}</a>
											</dd>
										</dl>
									</div>
								</div>
							</div>

							<!--<div v-if="status == 2">
								<div class="no_deal pad-l-12 pad-r-12 c999" v-if="item.is_read == 2">
									<div class="item pad-t-15 pad-b-15 pad-l-15 pad-r-15 bg-fff mag-t-10">
										<dl class="cf">
											<dt class="fl f-15 f-b"><span class="mag-r-5">{{item.table_name}}</span><span>{{b_lg[1341]}}</span></dt>
											<dd class="fr"><span class="clock pr"></span><span>{{item.date}}</span></dd>
										</dl>
										<dl class="cf mag-t-5">
											<dt class="fl f-16">
												<span class="mag-r-5" v-if="item.type == 1">{{b_lg[1342]}}</span>
												<span class="mag-r-5" v-else-if="item.type == 2">{{b_lg[1343]}}</span>
												<span class="mag-r-5" v-else-if="item.type == 3">{{b_lg[1344]}}</span>
											</dt>
											<dd class="fr">{{b_lg[1340]}}</dd>
										</dl>
									</div>

								</div>
							</div>-->
						</div>
						<div class="center c999 mag-t-10 no_more_data hide">{{b_lg['1151']}}</div>
						<div class="center c999 mag-t-10 loading hide">loading...</div>
					</div>
					<div v-else>
						<div class="no_info center f-14">
							<div class="bg"></div>
							<p>{{b_lg['1216']}}</p>
						</div>
					</div>
					<div class="bank10"></div>
				</div>

			</div>

		</div>
	</body>

	<script type="text/javascript">
		var app = null;
		function refresh() {  
			app.init(app.page_data.sel_data);
		}

		function refreshData() {  //呼叫服务员
			var ss =getItem("socketMsg");
			if(ss){
				app.add_msg(ss); //添加消息
			}
		}

		function cli_backpre() {
//			app.backpre()
		}
	
        function sco_type(v){ //判断Socket类型
        	switch(v){
        		case 'waiter_by_put_order_2':
        		return 1;
        		case 'waiter_by_put_call':
        		return 2; 
        		case 'waiter_by_put_call2':
        		return 3;
        	}
         
        	
        }
		function fun1() {
			get_table_deail = JSON.parse(getItem("table_deail"));
			setlange_obj(); //加载头部语言包
			if(isAPP) {
				down_load();
			}

			app = new Vue({
				el: "#app",
				data: {
					dealList: [],
					b_lg: global_lange, //语言包
					time: new Date().getTime(),
					status: 1,
					doNum: 0,
					unread_list: [],
					page_data: {
						lock: 1, //默认开启下拉刷新
						total: "", //总页数
						pag: "", //当前页数
						sel_data: 1 //选择的分类
					},
					Unprocessed: 0, //未处理的条数
					result: {
						list: {}
					},
					memory_result: []
				},
				mounted: function() {
					this.init(1)
				},
				methods: {
					init: function(cate_id) {
						var $th = this;
						$th.memory_result = [];
						$th.aj(1, cate_id)
					},
					add_msg:function(value){ //socket 添加未处理信息
						 var $th = this,
						     content = JSON.parse(value);
						 $th.Unprocessed++;
						 if($th.page_data.sel_data==1){
						 	var obj = {
						 		shop_table_id:content.data.shop_table_id,
						 		time:new Date(content.data.time * 1000).format("MM-dd hh:mm:ss"),
						 		table_name:get_table_deail[content.data.shop_table_id].table_name,
						 		is_read	:1,
						 		type:sco_type(content.type)
						 	}
						 	$th.memory_result.unshift(obj);
						 }
					},
					aj: function(page, type) { //加载数据
						$(".loading").removeClass("hide")
						var th = this;
						common_ajax("1", {
							page: page,
							pagesize: 10,
							is_read: type,
						}, "get_message_list", function(e) {
							if(type == 1) { //是否为未处理
								th.Unprocessed = e.result.count;
							}
							//整理分类格式
							th.page_data.total = e.result.total //总页数
							th.page_data.pag = e.result.page //当前页码
							$.each(e.result.list, function(k, v) {
								th.memory_result.push(v);
							});
							console.log("th.memory_result", th.memory_result)
							th.result = e.result;
							$(".loading").addClass("hide")

						})
						th.page_data.lock = 1
						th.xiala(); //开启下拉刷新
					},
					xiala: function() { //下拉刷新
						var winH = $(window).height(); //屏幕高度
						var $th = this;
						window.addEventListener('scroll', function(e) { //滚动事件
							var domH = $(".have-content").height(); //内容高度
							if((winH + $(window).scrollTop()) > domH - 90) {
								if(app.page_data.lock == 1) {
									app.page_data.lock = 0
									if(app.page_data.total <= app.page_data.pag) {
										if(app.page_data.total != 0 && domH != 0) {
											setTimeout(function(){
												$(".no_more_data").removeClass("hide")
											},800)
										}
									} else {
										$th.aj(++$th.page_data.pag, $th.page_data.sel_data);
									}
								}
							}
						}, true)
					},
//					消息处理
					cli_look: function(type, value) {
						if(type == 1) { //为1的时候为未处理
							var btnArray2 = [app.b_lg[1049], app.b_lg[1008]];
							mui.confirm(app.b_lg[1371], app.b_lg[1050], btnArray2, function(ee) {
								if(ee.index == 1) {
									if(value.type == 1) {
										app.checkOrder(value.shop_table_id, value.pax)
									} else {
										app.dealWith(value.type, value.shop_table_id, value.is_read)
									}
								}

							}, "div")
						}else{
							clicked('../set/confirmedOrder.html?type=1&table='+value.shop_table_id)
						}
					},
					backpre: function() {
						if(isAPP) {
							var preUrl = plus.webview.currentWebview().opener();
							preUrl.evalJS("bank_btn(1)")
						}
						com_back();
					},
					changenav: function(e, ele) {
						if(e == 1) {
							app.status = 1;
						} else if(e == 2) {
							app.status = 2;
						}
						var dom = event.currentTarget;

						$(dom).addClass("active");
						$(dom).siblings().removeClass("active")
					},
					sel_cate_list: function(cate_id) {
						var $th = this;
						$th.page_data.sel_data = cate_id;
						$th.memory_result = [];
						$th.init(cate_id)
					},
					dealWith: function(e,id) {
						var $th = this;
						if(e == 2) {
							common_ajax(1, {
								"shop_table_id": id
							}, "put_call_waiter_cancel", function(res) {
								if(res.status == 1) {
									removeItem("socketMsg")
									setTimeout(function(){
										$th.init($th.page_data.sel_data);
									},500)
								}
							})
						} else if(e == 3) {
							common_ajax(1, {
								"shop_table_id": id
							}, "put_call_waiter_cancel2", function(res) {
								if(res.status == 1) {
									removeItem("socketMsg")
									setTimeout(function(){
										$th.init($th.page_data.sel_data);
									},500)
								}
							})
						}
					},
					checkOrder: function(id, num) {
						clicked("../set/changeOrder.html?type=2&leave=record&table=" + id);
					}
				}
			})
		}
	</script>

</html>
